<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns:th="http://www.thymeleaf.org">

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0 ,minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">

    <title>结算页面</title>

    <link th:href="@{/AmazeUI-2.4.2/assets/css/amazeui.css}" rel="stylesheet" type="text/css"/>
    <link th:href="@{/basic/css/demo.css}" rel="stylesheet" type="text/css"/>
    <link th:href="@{/css/cartstyle.css}" rel="stylesheet" type="text/css"/>
    <link th:href="@{/css/jsstyle.css}" rel="stylesheet" type="text/css"/>
    <script type="text/javascript" th:src="@{/js/address.js}"></script>


    <link rel="stylesheet" type="text/css" th:href="@{/css/address.css}"/>
    <script th:src="@{/js/jquery-1.7.2.min.js}" type="text/javascript" charset="utf-8"></script>

    <script src="http://www.jq22.com/jquery/bootstrap-3.3.4.js"></script>
    <script type="text/javascript" th:src="@{/js/distpicker.js}"></script>
    <script type="text/javascript" th:src="@{/js/distpicker.data.js}"></script>
    <script th:src="@{/js/main.js}"></script>
    <script type="text/javascript" th:src="@{/js/settlement.js}"></script>

</head>

<body>

<!--顶部导航条 -->
<div class="am-container header" style="background-color: #e0efff;">
    <ul class="message-l">
        <div class="topMessage">
            <div class="menu-hd">

                <span class="fr">
            <span class="fl" th:if="${session.User == null}">你好，请<a th:href="@{/login}" style="color:#ff4e00;">登录</a>&nbsp;<a
                    th:href="@{/register}" style="color:#ff4e00;">免费注册</a>&nbsp;&nbsp;</span>
            <span class="fl" th:if="${session.User != null}"><a th:href="@{/user/information}">欢迎回来，<span
                    th:text="${session.User.username}"></span></a>&nbsp;|&nbsp;<a
                    th:href="@{/order/orderList}">我的订单</a>&nbsp;</span>
            <span class="fl" th:if="${session.User != null}">|&nbsp;<a th:href="@{/user/logout}">注销</a></span>
                </span>
            </div>
        </div>
    </ul>
    <ul class="message-r">
        <div class="topMessage home">
            <div class="menu-hd"><a th:href="@{/home}" target="_top" class="h">商城首页</a></div>
        </div>
        <div class="topMessage my-shangcheng">
            <div class="menu-hd MyShangcheng"><a th:href="@{/user/index}" target="_top"><i
                    class="am-icon-user am-icon-fw"></i>个人中心</a>
            </div>
        </div>


    </ul>
</div>

<!--悬浮搜索框-->

<div class="nav white">

    <div class="logoBig">
        <li><img src=../images/居家乐.jpg width="100px" height="90px"/></li>
    </div>

    <div class="search-bar pr">
        <a name="index_none_header_sysc" href="#"></a>
        <form th:action="@{/product/search}" method="post">
            <input id="searchInput" name="searchInput" type="text" placeholder="搜索" autocomplete="on">
            <input id="ai-topsearch" class="submit am-btn" value="搜索" type="submit">
        </form>
    </div>
</div>

<div class="clear"></div>
<div class="concent">
    <!--地址 -->
    <div class="paycont">
        <div class="address">
            <h3>确认收货地址 </h3>
            <div class="control">
                <div class="tc-btn createAddr theme-login am-btn am-btn-danger">使用新地址</div>
            </div>
            <div class="clear"></div>
            <ul>
                <div class="per-border"></div>


                <div class="per-border"></div>
                <li class="user-addresslist" th:each="address:${addressList}">
                    <div class="address-left">
                        <div class="user DefaultAddr" id="address">
                            <span class="buy-address-detail">
                                <input type="hidden" class="id" th:value="${address.id}" id="addressId"/>
                                <span class="buy-user" th:text="${address.receiverName}"></span>
                                <span class="buy-phone" th:text="${address.receiverMobile}"></span>
                            </span>
                        </div>
                        <div class="default-address DefaultAddr">
                            <span class="buy-line-title buy-line-title-type">收货地址：</span>
                            <span class="buy--address-detail">
                                <span class="province" th:text="${address.receiverProvince}"></span>
                                <span class="city" th:text="${address.receiverCity}"></span>
                                <span class="dist" th:text="${address.receiverDistrict}"></span>
                                <span class="street" th:text="${address.receiverAddress}"></span>
                            </span>
                        </div>
                        <ins class="deftip" th:if="${address.isDefault eq 0}">默认地址</ins>
                        <!--                        <ins class="deftip hidden">默认地址</ins>-->
                    </div>
                    <div class="address-right">
                        <span class="am-icon-angle-right am-icon-lg"></span>
                    </div>
                    <div class="clear"></div>

                    <div class="new-addr-btn">
                        <!--<a href="javascript:void(0);" onclick="setDefault(this);" class="setDefault" th:if="${address.isDefault eq 1}">设为默认</a>-->
                        <a href="javascript:void(0);" onclick="setDefault(this);" class="setDefault">设为默认</a>
                        <span class="new-addr-bar">|</span>
                        <a th:href="@{/user/edit(id=${address.id})}">编辑</a>
                        <span class="new-addr-bar">|</span>
                        <a href="javascript:void(0);" onclick="delClick(this);" class="delete-address">删除</a>
                    </div>

                </li>

            </ul>

            <div class="clear"></div>
        </div>

        <!--支付方式-->
        <div class="logistics">
            <h3>选择支付方式</h3>
            <ul class="pay-list">
                <!--                <li class="pay card"><img src="../images/wangyin.jpg"/>银联<span></span></li>-->
                <!--                <li class="pay qq"><img src="../images/weizhifu.jpg"/>微信<span></span></li>-->
                <li class="pay taobao"><img th:src="@{/images/zhifubao.jpg}"/>支付宝<span></span></li>
            </ul>
        </div>
        <div class="clear"></div>

        <!--订单 -->
        <div class="concent">
            <div id="payTable">
                <h3>确认订单信息</h3>

                <div class="content mar_20">
                    <table border="0" class="car_tab" style="width: 1000px; margin-bottom: 50px;" cellspacing="0"
                           cellpadding="0">

                        <tr>
                            <td class="car_th" width="200">商品名称</td>
                            <td class="car_th" width="150">单价</td>
                            <td class="car_th" width="150">购买数量</td>
                            <td class="car_th" width="130">小计</td>
                            <td class="car_th" width="150">操作</td>
                        </tr>

                        <tr class="goods" th:each="cart:${cartList}">
                            <td style="padding: 15px 20px;border-bottom: 1px solid #eaeaea;">
                                <div class="item-pic"
                                     style="width: 80px;height: 80px;float: left;overflow: hidden;border: 1px solid #eaeaea;">
                                    <a><img th:src="@{'/'+${cart.subImages}}" width="73" height="73"/></a>

                                </div>
                                <!--                                <div th:text="${cart.name}"></div>-->
                                <div class="item-info" style="margin-top: 20px;">
                                    <div class="item-basic-info">

                                        <a th:href="@{'/product/'+${cart.productId}}" th:text="${cart.name}"
                                           class="item-title J_MakePoint" data-point="tbcart.8.11"></a>
                                    </div>
                                </div>
                            </td>
                            <td align="center" style="color: #ff4e00;border-bottom: 1px solid #eaeaea;" id="price"
                                th:text="${cart.price}"></td>
                            <td align="center" style="padding: 15px 20px;border-bottom: 1px solid #eaeaea;">
                                <div class="c_num">
                                    <input type="hidden" class="productId" th:value="${cart.productId}"/>
                                    <input type="hidden" class="productPrice" th:value="${cart.price}"/>
                                    <input type="hidden" class="productStock" th:value="${cart.stock}"/>
                                    <input type="button" value="" onclick="subQuantity(this)" class="car_btn_1"/>
                                    <input type="text" th:value="${cart.quantity}" name="quantit" class="car_ipt"
                                           readonly="readonly"/>
                                    <input type="button" value="" onclick="addQuantity(this);" class="car_btn_2"/>
                                </div>
                            </td>
                            <input type="hidden" class="cartId" th:value="${cart.id}"/>
                            <td align="center" style="color: #ff4e00;border-bottom: 1px solid #eaeaea;" class="qprice"
                                th:text="'￥'+${cart.cost}"></td>
                            <td align="center" style="padding: 15px 20px;border-bottom: 1px solid #eaeaea;">
                                <a href="javascript:void(0);"
                                   onclick="removeCart(this);" class="delete">删除</a></td>
                        </tr>


                    </table>
                </div>
                <div class="clear"></div>
            </div>


        </div>
        <div class="clear"></div>


        <!--信息 -->
        <div class="order-go clearfix">
            <div class="pay-confirm clearfix">
                <div class="box">
                    <div tabindex="0" id="holyshit267" class="realPay"><em class="t">实付款：</em>
                        <span class="price g_price ">
                                    <em class="style-large-bold-red " id="totalprice">244.00</em>
											</span>
                    </div>

                    <div id="holyshit268" class="pay-address" th:each="address:${addressList}">
                        <div th:if="${address.isDefault eq 0}">
                            <p class="buy-footer-address">
                                <span class="buy-line-title buy-line-title-type">寄送至：</span>
                                <span class="buy--address-detail">
                                    <input type="hidden" class="addressID" th:value="${address.id}"
                                           th:if="${address.isDefault eq 0}"/>
								   <span class="province" th:text="${address.receiverProvince}"></span>
												<span class="city" th:text="${address.receiverCity}"></span>
												<span class="dist" th:text="${address.receiverDistrict}"></span>
												<span class="street" th:text="${address.receiverAddress}"></span>
												</span>
                                </span>
                            </p>
                            <p class="buy-footer-address">
                                <span class="buy-line-title">收货人：</span>
                                <span class="buy-address-detail">
                                         <span class="buy-user" th:text="${address.receiverName}">艾迪 </span>
												<span class="buy-phone"
                                                      th:text="${address.receiverMobile}">15871145629</span>
												</span>
                            </p>
                        </div>
                    </div>
                </div>

                <div id="holyshit269" class="submitOrder">
                    <div class="go-btn-wrap">
                        <a id="J_Go" class="btn-go" tabindex="0" title="点击此按钮，提交订单">提交订单</a>
                    </div>
                </div>
                <div class="clear"></div>
            </div>
        </div>
    </div>

    <div class="clear"></div>
</div>

<th:block th:include="common.html :: footer"></th:block>

<div class="theme-popover-mask"></div>
<div class="theme-popover">

    <!--标题 -->
    <div class="am-cf am-padding">
        <div class="am-fl am-cf"><strong class="am-text-danger am-text-lg">新增地址</strong> / <small>Add address</small>
        </div>
    </div>
    <hr/>

    <div class="am-u-md-12">
        <form class="am-form am-form-horizontal" method="post" th:action="@{/cart/address}">

            <div class="am-form-group">
                <label for="user-name" class="am-form-label">收货人</label>
                <div class="am-form-content">
                    <input type="text" id="user-name" required="required" placeholder="收货人">
                </div>
            </div>

            <div class="am-form-group">
                <label for="user-phone" class="am-form-label">手机号码</label>
                <div class="am-form-content">
                    <input id="user-phone" required="required" placeholder="手机号必填" type="tel">
                </div>
            </div>

            <div class="am-form-group">
                <label for="user-phone" class="am-form-label">所在地</label>
                <div class="am-form-content address">
                    <div data-toggle="distpicker" id="target">
                        <select data-province="---- 选择省 ----"></select>
                        <select data-city="---- 选择市 ----"></select>
                        <select data-district="---- 选择区 ----"></select>
                    </div>
                </div>
            </div>

            <div class="am-form-group">
                <label for="user-intro" class="am-form-label">详细地址</label>
                <div class="am-form-content">
                    <textarea class="" rows="3" id="user-intro" placeholder="输入详细地址"></textarea>
                    <small>写出你的详细地址(100字以内)</small>
                </div>
            </div>

            <div class="am-form-group theme-poptit">
                <div class="am-u-sm-9 am-u-sm-push-3">

                    <input class="am-btn am-btn-danger btnSub" type="submit" name="" value="保存"/>
                    <!-- <div type="submit" class="am-btn am-btn-danger btnSub">保存</div> -->
                    <div class="am-btn am-btn-danger close">取消</div>
                </div>
            </div>
        </form>
    </div>

</div>

<div class="clear"></div>
</body>


</html>